<template>
  <!-- 下架管理 -->
  <el-dialog
    v-model="operateDialogVisible"
    :close-on-click-modal="false"
    :title="$t('distributionProdLog.offlineManagement')"
    :lock-scroll="true"
    :destroy-on-close="true"
    class="component-shop-offline-manage operate-dlg"
    @close="onClose"
  >
    <div
      v-if="showOfflineManage"
      class="off-shelf-mag"
    >
      <div class="msg">
        <div class="msg-item">
          <div class="tit">
            {{ $t('groups.handler') }}：
          </div>

          <div class="int">
            {{ offlineDetail.handler }}
          </div>
        </div>
        <div class="msg-item">
          <div class="tit">
            {{ $t('components.offlineTime') }}：
          </div>
          <div class="int">
            {{ offlineDetail.createTime }}
          </div>
        </div>
        <div class="msg-item">
          <div class="tit">
            {{ $t('components.processingStatus') }}：
          </div>
          <el-tag
            v-if="offlineDetail.status === 1"
            type="danger"
          >
            {{ $t('components.platformOffline') }}
          </el-tag>
          <el-tag
            v-if="offlineDetail.status === 2"
            type="warning"
          >
            {{ $t('groups.moderated') }}
          </el-tag>
          <el-tag
            v-if="offlineDetail.status === 3"
            type="success"
          >
            {{ $t('productComm.pass') }}
          </el-tag>
          <el-tag
            v-if="offlineDetail.status === 4"
            type="danger"
          >
            {{ $t('shop.auditFailed') }}
          </el-tag>
        </div>
        <div class="msg-item">
          <div class="tit">
            {{ $t('components.reasonForOffline') }}：
          </div>

          <div class="int">
            {{ offlineDetail.offlineReason }}
          </div>
        </div>
        <div
          v-if="offlineDetail.status === 2 && !canDirectOnline"
          class="msg-item"
        >
          <div class="tit">
            {{ $t('components.processingStatus') }}：
          </div>

          <div class="int">
            <el-radio-group v-model="examineStatus">
              <el-radio :label="3">
                {{ $t('productComm.pass') }}
              </el-radio>
              <el-radio :label="4">
                {{ $t('shop.auditFailed') }}
              </el-radio>
            </el-radio-group>
          </div>
        </div>
        <div
          v-if="offlineDetail.status === 2 && examineStatus===4"
          class="msg-item"
        >
          <div class="tit">
            {{ $t('shopProcess.rejectReason') }}：
          </div>
          <div class="int">
            <el-input
              v-model="refuseReason"
              maxlength="200"
              type="textarea"
              :rows="2"
              placeholder="审核不通过的原因，200字以内"
            />
          </div>
        </div>
      </div>
      <div
        v-if="offlineDetail.offlineHandleEventItemList.length > 0"
        class="log"
      >
        <div class="log-tit">
          {{ $t('components.applicationHistory') }}
        </div>

        <div
          v-for="(item,index) in offlineDetail.offlineHandleEventItemList"
          :key="index"
          class="log-item"
        >
          <p>
            <span class="tit">{{ $t('shop.applicationDate') }}：</span>

            <span class="txt">{{ item.reapplyTime }}</span>
          </p>
          <p>
            <span class="tit">申请理由：</span>
            <span class="txt">{{ item.reapplyReason }}</span>
          </p>
          <p v-if="item.auditTime">
            {{ $t('components.reviewTime') }}：{{ item.auditTime }}
          </p>
          <p v-if="item.refuseReason">
            {{ $t('components.denialReason') }}：{{ item.refuseReason }}
          </p>
        </div>
      </div>
    </div>
    <template #footer>
      <div
        class="dialog-footer"
      >
        <div
          class="default-btn"
          @click="operateDialogVisible = false"
        >
          {{ $t('allinpay.cancel') }}
        </div>
        <div
          v-if="offlineDetail.status === 2 && !canDirectOnline"
          class="default-btn primary-btn"
          @click="offlineDataSubmit()"
        >
          {{ $t('group.confirmReview') }}
        </div>
        <div
          v-if="canDirectOnline"
          class="default-btn primary-btn"
          @click="directOnline()"
        >
          {{ $t('shopProcess.backOnline') }}
        </div>
      </div>
    </template>
  </el-dialog>
</template>

<script setup>
import { ElMessage } from 'element-plus'

const emit = defineEmits(['refreshDataList'])

const operateDialogVisible = ref(false) // 操作对话框
const showOfflineManage = ref(false) // 下架管理
const offlineDetail = ref({}) // 最新下线

const canDirectOnline = ref(false) // 是否可以直接上线

const init = (data, canDirectOnlinePar) => {
  operateDialogVisible.value = true
  showOfflineManage.value = true
  offlineDetail.value = data
  if (canDirectOnlinePar === 'canDirectOnline') {
    canDirectOnline.value = true
  }
}

/**
 * 直接上线
 */
const directOnline = () => {
  const param = {
    handleId: offlineDetail.value.shopId,
    eventId: offlineDetail.value.eventId,
    status: offlineDetail.value.status
  }
  http({
    url: http.adornUrl('/platform/shopDetail/onlineOpenShop'),
    method: 'post',
    data: http.adornData(param)
  }).then(() => {
    ElMessage({
      message: $t('allinpay.onLineTip'),
      type: 'success',
      duration: 1000,
      onClose: () => {
        onClose()
        emit('refreshDataList')
      }
    })
  })
}

const examineStatus = ref(3) // 审核
const refuseReason = ref('') // 拒绝理由
let isSubmit = false
// 审核商家上架申请
const offlineDataSubmit = () => {
  if (examineStatus.value === 4 && !refuseReason.value) {
    ElMessage({
      message: $t('shopProcess.auditTip3'),
      type: 'warning',
      duration: 1000
    })
    return
  }
  if (isSubmit) {
    return
  }
  const data = {
    handleId: offlineDetail.value.shopId,
    eventId: offlineDetail.value.eventId,
    status: examineStatus.value, // 审核状态
    refuseReason: refuseReason.value // 拒绝理由
  }
  isSubmit = true
  http({
    url: http.adornUrl('/platform/shopDetail/auditShop'),
    method: 'POST',
    data
  }).then(() => {
    ElMessage({
      message: $t('allinpay.submitSuccess'),
      type: 'success',
      duration: 1000,
      onClose: () => {
        onClose()
        emit('refreshDataList')
      }
    })
    isSubmit = false
  }).catch(() => {
    isSubmit = false
  })
}

// 当关闭时
const onClose = () => {
  operateDialogVisible.value = false // 操作对话框
  showOfflineManage.value = false // 下架管理
  offlineDetail.value = {} // 最新下线
  refuseReason.value = '' // 拒绝理由
  examineStatus.value = 3 // 审核
  canDirectOnline.value = false
}

defineExpose({
  init
})

</script>

<style lang="scss" scoped>
@use "index";
</style>
